<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h2>this使用场景</h2>
    <button class="btn">测试this</button>
</body>
<script>
    //1.在全局下 this指向window
    // console.log(this)  //this????

    //2.在函数中
    // function test() {
    //     console.log('函数里',this)   //??window
    // }

    // test()

    //3.在构造函数[类]中,this指向谁
    // function test() {
    //     this.name='小辉'
    //     console.log('在构造函数里',this.name)   //?? 指向实例化的对象
    // }

    // const t1=new  test()
    // console.log(t1.name)

    //4.在对象中的this
    // let obj={
    //     name:'小辉',
    //     getName:function() {
    //        // console.log('对象里的：',this)  //??
    //        let fn=function() {
    //           console.log('fn的this：',this)   // this--->window
    //        }

    //        fn()
    //     }
    // }

    // obj.getName()


    //5.dom中的this,谁操作指向谁
    // const btn = document.querySelector('.btn')
    // btn.onclick = function() {
    //     console.log('dom的this:', this) //??
    //     this.style.background = '#f00'
    // }

    //6.定时器中this,永远window
    // let obj = {
    //     fn: function() {
    //         console.log(this)
    //         let _this = this
    //         setTimeout(function() {
    //             console.log('settimeout:', _this)
    //         }, 3000)
    //     }
    // }

    // obj.fn()

    //6.特殊情况
    var username = '2112B'
    var obj = {
        username: 'jack',
        getName: function() {
            console.log(this) //打印结果？？？?
        }
    }

    // obj.getName()  //谁调用指向谁

    console.log((obj.getName = obj.getName)())
    console.log((false || obj.getName)())
</script>

</html>